<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
<style>
 
#header {
    background-color: rgb(224, 155, 182);
    color:white;
    text-align:center;
    padding:5px;
}

#main {
   
    width:350px;
    float:center;
    padding:10px;	 	 
}
#footer {
    background-color:rgb(83, 164, 230);
    color:white;
    clear:both;
    text-align:center;
   padding:15px;	 	 
}
</style>
</head>

<body>

<div id="header">
  <head>
    <h1>
      中国一流高校官网
    </h1>
    <style>
    ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      overflow: hidden;
      background-color: rgb(255, 255, 255);
    }
    
    li {
      float: left;
    }
    
    li a {
      display: block;
      color: rgb(160, 16, 23);
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
    }
    
    li a:hover {
      background-color: rgb(223, 194, 31);
    }
    </style>
    </head>
    <body>
    
    <ul>
      <li><a class="active" href="http://www.jxufe.edu.cn/">江西财经大学</a></li>
      <li><a href="https://www.tsinghua.edu.cn/">清华大学</a></li>
      <li><a href="https://www.pku.edu.cn/">北京大学</a></li>
      <li><a href="https://www.sjtu.edu.cn/">上海交通大学</a></li>
      <li><a href="https://www.fudan.edu.cn/">复旦大学</a></li>
    </ul>
    
    </body>
</div>



<div id="main">
  <head>
    <style>
    #customers {
      font-family: Arial, Helvetica, sans-serif;
      border-collapse: collapse;
      width: 550%;
    }
    
    #customers td, #customers th {
      border: 2px solid rgb(155, 174, 226);
      padding: 8px;
    }
    
    #customers tr:nth-child(even){background-color: #e4d3d3;}
    #customers tr:hover {background-color: rgb(233, 136, 177);}
    
    #customers th {
      padding-top: 12px;
      padding-bottom: 12px;
      text-align: center;
      background-color: #7807e2;
      color: white;
    }
    </style>
    </head>
    <body>
    <table id="customers">
      <tr>
        <th>大学</th>
        <th>软科中国排名</th>
        <th>QS全球排名</th>
        <th>所在城市</th>
      </tr>
      <tr>
        <td>江西财经大学</td>
        <td>118</td>
        <td>无（隐藏的第一不需要上榜）</td>
        <td>天下英雄城</td>
      </tr>
      <tr>
        <td>清华大学</td>
        <td>1</td>
        <td>17</td>
        <td>北京</td>
      </tr>
      <tr>
        <td>北京大学</td>
        <td>2</td>
        <td>18</td>
        <td>北京</td>
      </tr>
      <tr>
        <td>上海交通大学</td>
        <td>4</td>
        <td>50</td>
        <td>上海</td>
      </tr>
      <tr>
        <td>复旦大学</td>
        <td>5</td>
        <td>31</td>
        <td>上海</td>
      </tr>
      
    </table>
    </body>

      <body>
      
      
      <h1>到达世界最高城 南昌！<h1>
      <h1>太美丽啦 南昌o.O!</h1>
      
      </body>
  
      <head>
        <style>
        div.gallery {
          margin: 5px;
          border: 1px solid rgb(228, 16, 16);
          float:left;
          width: 180px;
       
        }
        
        div.gallery:hover {
          border: 1px solid rgb(220, 223, 42);
        }
        
        div.gallery img {
          width: 200%;
          height: auto;
       
        }
        
        div.desc {
          padding: 40px;
          text-align: center;
      
        }
        </style>
        </head>
        <body>
        <table>
        <div class="gallery">
          <a target="_blank" href="https://gitee.com/LOGIC1JUFE/hw/raw/master/OIP-C.jpg">
            <img src="https://gitee.com/LOGIC1JUFE/hw/raw/master/OIP-C.jpg" alt="81" width="6000" height="4000">
          </a>
          <div class="desc">八一纪念碑</div>
        </div>
        
        <div class="gallery">
          <a target="_blank" href="https://gitee.com/LOGIC1JUFE/hw/raw/master/R-C%20(1).jpg">
            <img src="https://gitee.com/LOGIC1JUFE/hw/raw/master/R-C%20(1).jpg" alt="桥" width="600" height="400">
          </a>
          <div class="desc">朝阳大桥</div>
        </div>
        
        <div class="gallery">
          <a target="_blank" href="https://gitee.com/LOGIC1JUFE/hw/raw/master/R-C.jpg">
            <img src="https://gitee.com/LOGIC1JUFE/hw/raw/master/R-C.jpg" alt="滕王阁" width="600" height="400">
          </a>
          <div class="desc">滕王阁</div>
        </div>
        
        <div class="gallery">
          <a target="_blank" href="https://gitee.com/LOGIC1JUFE/hw/raw/master/v2-823f64d757a03bb5f630a34022b5c01c_r.jpg">
            <img src="https://gitee.com/LOGIC1JUFE/hw/raw/master/v2-823f64d757a03bb5f630a34022b5c01c_r.jpg" alt="江财" width="600" height="400">
          </a>
          <div class="desc">江西常春藤</div>
        </div>
        </table>
        
        </body>
</div>

<div id="footer">
<h3>此网页内容皆为瞎掰  (o.O )? 如有雷同，纯属巧合。</h3>
</div>

</body>
</html>
